import { Component, OnInit } from "@angular/core";
import { SelfCheckBean } from "./bean/self-check.bean";
import {
  FormBuilder,
  FormGroup,
  Validators,
  FormControl
} from "@angular/forms";
import { NzModalService, NzModalSubject } from "ng-zorro-antd";
import { Router, ActivatedRoute, ParamMap } from "@angular/router";
import { HttpServcie } from "../../../service/http.service";
import { NzNotificationService } from "ng-zorro-antd";
import { Config } from "../../../service/config";
import { CommFuntion } from "../../../service/commFunction";

@Component({
  selector: "app-self-check",
  templateUrl: "./self-check.component.html",
  styleUrls: ["./self-check.component.scss"]
})
/**
 * 应急救援
 */
export class SelfCheckPage implements OnInit {
  list: any = []; //返回数据列表
  picList = [];
  total: any;
  selfCheckBean: SelfCheckBean = new SelfCheckBean();
  data: any; //传入详细页面数据
  currentModal: NzModalSubject;
  config = Config;
  elevatorType: string;
  constructor(
    private modalService: NzModalService,
    private router: Router,
    private route: ActivatedRoute,
    private httpServcie: HttpServcie,
    private _notification: NzNotificationService,
    private commFunc: CommFuntion
  ) {}

  ngOnInit() {
    this.selfCheckBean.pageSize = 10;
    this.selfCheckBean.currentPage = 1;
    this.route.paramMap.subscribe(data => {
      //查询电梯的信息
      this.selfCheckBean.elevatorId = data.get("elevatorId");
      this.elevatorType = data.get("elevatorType");
      this.query();
    });
  }
  //查询
  query() {
    //查询当前电梯救援记录
    this.httpServcie.querySelfCheckList(this.selfCheckBean).subscribe(
      data => {
        if (data.status == 200) {
          this.list = data.data.list;
          this.total = data.data.total;
        } else if (data.status === 401) {
          this.router.navigateByUrl("/login");
          return;
        } else {
          // 异常
          this._notification.create("error", "错误提示", data.message);
        }
      },
      error => {
        console.log(JSON.stringify(error));
      }
    );
  }
  //table加载数据时
  displayDataChange($event) {
    this.list = $event;
  }
  //分页
  nzPageSizeChange(event) {
    this.selfCheckBean.pageSize = event;
    this.selfCheckBean.currentPage = 1;
    this.query();
  }

  //输入框的方法
  nzPageIndexChange(event) {
    this.selfCheckBean.currentPage = event;
    this.query();
  }

  //当前页
  nzPageIndexClickChange(event) {
    this.selfCheckBean.currentPage = event;
    this.query();
  }
  toDetail(id) {
    this.router.navigate([
      "/home/self-check-detail",
      { id: id, elevatorType: this.elevatorType }
    ]);
  }

  //返回
  toBack() {
    window.history.back();
  }

  showLargeImage(titlepic, contentpic, footerpic, img) {
    this.picList = [];
    this.picList.push(img);
    this.currentModal = this.modalService.open({
      title: titlepic,
      content: contentpic,
      footer: footerpic,
      maskClosable: false,
      width: 800,
      style: {
        top: "20px"
      },
      onOk() {
        console.log("Click ok");
      }
    });
  }

  /**
   * 下载年检报告
   */
  downloadReport(data){
    if(!data.reportUrl){
      this._notification.create("error", "提示", "没有文件");
      return;
    }
    let list: any = data.reportUrl.split(",")
    for (let i = 0; i < list.length; i++) {
      let name1 = '年度检查报告' + (i + 1) + "." + list[i].split(".")[1];
      this.download(list[i], name1);
    }
  }

  download(url, name) {
    let link = document.createElement('a');
    let body = document.querySelector('body');

    this.getBlob(this.config.IP + this.config.API.getUpload + url).then(blob => {
      link.href = window.URL.createObjectURL(blob);
      link.download = name;
      // fix Firefox
      link.style.display = 'none';
      body.appendChild(link);
      link.click();
      body.removeChild(link);
      window.URL.revokeObjectURL(link.href);
    });
  }

  getBlob(url) {
    return new Promise(resolve => {
      const xhr = new XMLHttpRequest();
      xhr.open('GET', url, true);
      xhr.responseType = 'blob';
      xhr.onload = () => {
        if (xhr.status === 200) {
          resolve(xhr.response);
        }
      };
      xhr.send();
    });
  }
}
